<template>
  <el-main style="padding-top: 3rem">
    <el-col :span="24">
      <swiper>
        <swiper-slide class="swiper-slide1">
          <el-col :span="24">
            <div class="page">
              <img src="@/assets/virus/13.jpeg" width="480rem" height="290rem"/>
            </div>
            <div class="page">
              <label>新冠病毒变异的相当迅速，世卫组织将其历代变异病毒按照希腊字母进行编号</label>
              <tr>. </tr>
              <label>向左滑动至下一页</label>
            </div>
          </el-col>
<!--          <el-col :span="6">-->
<!--            &lt;!&ndash;横排转竖排&ndash;&gt;-->
<!--          </el-col>-->
        </swiper-slide>
        <swiper-slide class="swiper-slide1">
          <el-col :span="24">
            <div class="page">
              <img src="@/assets/virus/14.jpeg" width="480rem" height="350rem"/>
            </div>
            <div class="page">
              <label style="width: 6rem"><strong>Alpha</strong></label>
              <tr></tr>
              <label>2020年末在英国首次发现。该变异株含有超过十几种突变，一些突变位于刺突蛋白。变异的主要特征是强化了传播性，毒性似乎也有增强，但并不是很突出。另一种突变是刺突蛋白氨基酸69-70缺失。存在此缺失时，一些新冠病毒的分子检测不能检出编码刺突蛋白靶点。</label>
            </div>
          </el-col>
        </swiper-slide>
        <swiper-slide class="swiper-slide1">
          <el-col :span="24">
            <div class="page">
              <img src="@/assets/virus/15.jpeg" width="480rem" height="350rem"/>
            </div>
            <div class="page">
              <label style="width: 6rem"><strong>Beta</strong></label>
              <tr></tr>
              <label>2020年末在南非发现。该变异病毒株存在刺突蛋白的另一种突变。其特征是增加了传播性，毒性。已上市的mRNA疫苗的保护效能对该变异病毒相对下降。</label>
            </div>
          </el-col>
        </swiper-slide>
      </swiper>
    </el-col>
  </el-main>
</template>

<script>
import { swiper, swiperSlide } from "vue-awesome-swiper";
import "swiper/dist/css/swiper.css";
export default {
  name: "VariationHistory",
  components: {
    swiper,
    swiperSlide
  },
  data() {
    return {
      swiperOption: {
        notNextTick: true,
        direction: 'horizontal',//vertical
        grabCursor: true,
        setWrapperSize: true,
        autoHeight:true,
        slidesPerView: 1,
        mousewheel: false,
        keyboardControl: false,
        mousewheelControl: false,
        height: window.innerHeight,
        resistanceRatio:0,
        observeParents:true
      }
    }
  },
  created(){
  },
}
</script>

<style scoped>

</style>
